import React, { Component } from 'react';
import "../styles/Bottom.scss"

import shop from '../assets/shouye.png'
import fenlei from '../assets/fenlei.png'
import all from '../assets/diejia.png'
import gouwuche from '../assets/gouwuche.png'
import wode from '../assets/wode.png'


class Bottom extends Component {
    constructor(props) {
        super(props)
        this.state = {
            list: [
                { pic: shop, text: '店铺' }, { pic: fenlei, text: '分类' }, { pic: all, text: '全部商品' }, { pic: gouwuche, text: '购物车' }, { pic: wode, text: '个人中心' }
            ]
        }
    }
    render() {
        return (
            <div className="bottom">
                {
                    this.state.list.map((item, index) => {
                       return(
                         <div className="item" key={index}>
                            <img src={item.pic} alt="" />
                            <div className="text">{item.text}</div>
                        </div>
                       )
                    })
                }
            </div>
        );
    }
}

export default Bottom;